<!--//页面可直接使用数据，放到想用到的地方-->
<!--<template>-->
<!--<div>-->
<!--{{this.readSysMsgList}}-->
<!--</div>-->
<!--</template>-->

<!--//贴入本项目的业务代码（主要看我el-table遍历data   :data="this.readSysMsgList"直接就可渲染）-->
<template>
    <div class="navbar">
        <el-dialog :modal="false" title="您的消息" :visible.sync="moreFlag" class="tableLocation">
            <el-table :data="this.readSysMsgList" height="200" @row-click="rowClick">
                <el-table-column align="center" width="40">
                    <template slot-scope="scope">
                        <i v-if="scope.row.messageType == '1'" class="el-icon-warning" style="color:#d0183d"></i>
                        <i v-else class="el-icon-warning" style="color:#45d720"></i>
                    </template>
                </el-table-column>
                <el-table-column property="messageType" label="消息类型" width="70">
                    <template slot-scope="scope">
                        <div v-if="scope.row.messageType == '1'">新任务</div>
                        <div v-else-if="scope.row.orderStatus == '2'">待跟进</div>
                        <div v-else-if="scope.row.orderStatus == '3'">待执行</div>
                    </template>
                </el-table-column>
                <el-table-column property="content" label="消息内容"></el-table-column>
            </el-table>
        </el-dialog>
    </div>
</template>


<script>
    import {mapActions, mapState} from 'vuex'

    export default {
        computed: {
            // <!--//获取vuex中存放的数据-->
            ...mapState("utils", ["readSysMsgList", "readSysMsgListLength"]),
        },
    }
    // export default {
    //     name: "Message"
    // }
</script>

<style scoped>

</style>
